<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>订单查询</title>
    <link rel="stylesheet" href="/static/cash/css/order.css">
    <script src="/static/cash/js/jquery-3.2.1.min.js"></script>
</head>

<body>
    <header>
        <div>
            <img src="/static/cash/img/logo.png" alt="">
            <div>订单查询</div>
        </div>
        <div>
            <a href="">
                返回
            </a>
        </div>
    </header>
    <div class="headline">
        <div>
            <div>会员</div>
            <input type="text" placeholder="请输入订单号">
            <a href="">查询</a>
            <a href="">退款订单查询</a>
            <a href="">预订/自取</a>
        </div>
        <div>
            <div>编号</div>
            <div>订单金额</div>
            <div>时间</div>
            <div>操作</div>
        </div>
    </div>
    <div class="content">
        <div class="list">
            <div>
                <div>12345678912345678912345678</div>
                <div>8.00</div>
                <div>2018.5.21 13:05:21</div>
            </div>
            <div onclick="pupopclick()">打印</div>
        </div>
    </div>

    <div class="pupop"></div>
    <div class="pupop-content">
        <div class="pupop-headline">
            订单详情
        </div>
        <div>
            <div>商品</div>
            <div>规格</div>
            <div>单价</div>
            <div>数量</div>
            <div>折扣</div>
        </div>
        <div id="pupop-roll">
            <!-- 循环开始 -->
            <div>
                <div>
                    <p>
                        商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品商品
                    </p>
                </div>
                <div>规格</div>
                <div>单价</div>
                <div>数量</div>
                <div>折扣</div>
            </div>

            <!-- 循环结束 -->
        </div>
        <div>
            <div>
                <div>付款时间：2018.05.21 11:22:41</div>
                <div>总计：55.00</div>
            </div>
            <div>优惠：12.00</div>
        </div>
        <div>
            <div>
                <div>收款</div>
                <div>微信20.00</div>
                <div>支付宝20.00</div>
            </div>
            <div>收款：40.00</div>
        </div>
        <a href="">打印</a>
        <div>关闭</div>
    </div>
    <script>
        function pupopclick() {
            $('.pupop').css('display', 'block');
            $('.pupop-content').css('display', 'block');
        };
        $(function () {
            // 订单信息弹出层

            $('.pupop-click').click(function () {});
            $('.pupop-esc').click(function () {
                $('.pupop').css('display', 'none');
                $('.pupop-content').css('display', 'none');

            });
            $('.pupop').click(function () {
                $('.pupop').css('display', 'none');
                $('.pupop-content').css('display', 'none');
            });
        });
    </script>
</body>

</html>